<!--
 * @Author: songxiang songxiang0806@qq.com
 * @Date: 2025-08-21 16:02:53
 * @LastEditors: songxiang songxiang0806@qq.com
 * @LastEditTime: 2025-08-26 18:54:05
 * @FilePath: \supermap-webgl\src\components\menus-container\menus-container.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div
    class="menus-container"
    :class="
      props.position == 'right'
        ? 'right-menus-container'
        : 'left-menus-container'
    "
  >
    <el-container>
      <el-header>{{ props.title }}</el-header>
      <el-divider />
      <el-main>
        <slot></slot>
      </el-main>
    </el-container>
  </div>
</template>

<script lang="ts" setup>
import { defineProps } from 'vue'
import { IMenusProps } from './use-menus-container'

const props = withDefaults(defineProps<IMenusProps>(), {
  title: 'Header',
  position: 'right'
})
</script>

<style scoped lang="scss">
@import url('./menus-container.scss');
</style>
